<template>
  <div>
    <el-table :data="paper" border stripe :header-cell-class-name="'headerBg'">
      <el-table-column prop="id" label="ID" width="60" sortable></el-table-column>
      <el-table-column prop="name" label="Question"></el-table-column>
      <el-table-column prop="type" label="Question type">
        <template v-slot="scope">
          <span v-if="scope.row.type === 1">Choice question</span>
          <span v-if="scope.row.type === 2">Judge question</span>
          <span v-if="scope.row.type === 3">Question and answer</span>
        </template>
      </el-table-column>
      <el-table-column prop="a" label="A option" width="100"></el-table-column>
      <el-table-column prop="b" label="B option" width="100"></el-table-column>
      <el-table-column prop="c" label="C option" width="100"></el-table-column>
      <el-table-column prop="d" label="D option" width="100"></el-table-column>
      <el-table-column prop="score" label="Standard score"></el-table-column>
      <el-table-column prop="answer" label="Standard answer"></el-table-column>
      <el-table-column prop="studentAnswer" label="Student answers"></el-table-column>
      <el-table-column prop="detail" label="Analysis"></el-table-column>
      <el-table-column prop="studentScore" label="Score">
        <template v-slot="scope">
          <el-input v-model="scope.row.studentScore"></el-input>
        </template>
      </el-table-column>
    </el-table>

    <div style="margin: 20px 0">
      <el-button type="primary" @click="submitScore">Submit</el-button>
    </div>
  </div>
</template>

<script>
export default {
  name: "HandlePaper",
  data() {
    return {
      sp: this.$route.query.sp,
      paper: []
    }
  },
  created() {
    this.request.get("/studentpaper/" + this.sp).then(res => {
      this.paper = JSON.parse(res.data.paper)
      if (this.paper && this.paper.length) {
        this.paper.forEach(item => {  // 自动阅卷
          if (item.answer === item.studentAnswer) {
            item.studentScore = item.score
          }
        })
      }
    })
  },
  methods: {
    submitScore() {
      let sum = 0
      this.paper.forEach(item => {
        if (item.studentScore == null) {
          item.studentScore = 0
        }
        sum += parseInt(item.studentScore)
      })
      this.request.post("/studentpaper/", {id: this.sp, score: sum}).then(res => {
        this.$message.success("Score successfully")
        this.$router.push('/studentpaper')
      })
    }
  }
}
</script>

<style scoped>

</style>